<html>
<head>
    <meta charset="utf-8">
    <title>意见反馈</title>
    <#assign base=request.contextPath  />
    <#setting  number_format="0.##"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${base}/frame/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${base}/backstage/css/style.css" media="all">
    <link rel="stylesheet" href="${base}/sweep/css/app.css" media="all">
    <link rel="stylesheet" href="${base}/sweep/css/mui.min.css" media="all">
    <link rel="stylesheet" type="text/css" href="${base}/sweep/css/style.css"/>
    <script src="${base}/backstage/js/jquery.min.js"></script>
    <script src="${base}/sweep/js/mui.js"></script>
    <script src="${base}/frame/layui/layui.js"></script>
    <style>
        body {
            margin: 0 auto;
        }
        .mui-btn-block {
            padding: 6px 0;
        }

        .mui-icon-arrowthindown {
            font-size: 14px;
            color: #007aff;
            font-weight: bold
        }

        .info_list {
            width: 100%;
            background-color: #f2f2f2;
            height: 40px;
            border-bottom: 1px solid #F2F2F2;
        }

        .list_left2 {
            width: 97%;
            margin-left: 3%;
            height: 40px;
            font-family: "微软雅黑";
            font-size: 13px;
            color: #000000;
            line-height: 40px;
            float: left;
            margin-bottom: 14px;
        }

        .list_left2 span {
            color: #A04E52;
            font-size: 10px;
            margin-left: 5px;
        }

        .id_img_wp {
            width: 94%;
            margin: 0 auto;
            min-height: 30px;
        }

        .img_wp {
            width: 40%;
            margin: 0 5% 0 5%;
            float: left;
            cursor: pointer;
        }

        .img_wp img {
            width: 100%;
            height: 100%;
        }

        .img_intro {
            color: #383838;
            text-align: center;
            font-family: "微软雅黑";
            padding: 10px 0 10px 0;
        }

        .mui-input-row {
            border-top: 1px solid #F2F2F2;
        }

        .mui-table-view:after {
            display: none;
        }

        .col2 {
            background-color: #F2F2F2;
        }

        .van-popup {
            background: none;
            color: white;
        }

        .van-overlay {
            display: none;
            background-color: rgba(0, 0, 0, 0.29);
        }
    </style>
</head>
<body>
<div class="mui-content">
    <div class="mui-input-row col2">
        <label>反馈类型<span class="mui-icon mui-icon-arrowthindown"></span></label>
    </div>
    <div class="mui-input-row">
        <#list feedbackClassification as feedbackClassification>
            <div class="mui-input-row mui-radio ">
                <label>${feedbackClassification.name}</label>
                <input name="type" id="type" value="${feedbackClassification.id}" type="radio" checked>
            </div>
        </#list>

        <br>
        <div class="mui-input-row">
            <label>手机号</label>
            <input type="number" id="phone" placeholder="请输入手机号">
        </div>
        <div class="mui-input-row" style="margin: 10px 5px;">
            <textarea rows="5" id="feedback" placeholder="请输入您的问题反馈"></textarea>
        </div>
        <div class="info_list" style="border-bottom:none;">
            <div class="list_left2">反馈图片<span>(请上传反馈图片，图片保持清晰)</span></div>
        </div>

        <div class="layui-upload-drag" id="fan" style="width: 100%;height: 26%;">
            <i class="layui-icon"></i>
            <p>点击上传，或将文件拖拽到此处</p>
        </div>
    </div>
</div>
<div class="mui-content" >
    <div class="mui-content-padded">
        <button type="button"  class="mui-btn mui-btn-warning mui-btn-block" onclick="saveDoctor()">提 交</button>
    </div>
</div>
</body>
<script>

    var fan = "";
    var layer;
    layui.use(['form', 'layer', 'upload'], function () {
        var form = layui.form
            , $ = layui.jquery
            , upload = layui.upload;
        layer = layui.layer

        //身份证正面
        upload.render({
            elem: '#fan'
            ,url: '${base}/admin/file/uploadFile'
            , before: function (obj) {
                layer.load(); //上传loading
            }
            ,done: function(res){
                layer.closeAll('loading'); //关闭loading
                if (res.code > 0) {
                    return layer.msg('上传失败');
                }
                $("#fan i").remove()
                $("#fan p").remove()
                $('#fan').append('<img src="' + res.data + '" style="width: 100%;height: 100%">'); //图片链接（base64）
                fan += res.data;
            }
        });
    })

    function saveDoctor() {
        if($("#feedback").val()==""){
            mui.alert("请输入反馈问题")
            return;
        }
        if($("#phone").val()==""){
            mui.alert("请输入联系电话")
            return;
        }
        if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test($("#phone").val()))) {
            layer.msg("联系电话格式不对");
            return;
        }

        var jsonDate = {
            type:$('input:radio[name="type"]:checked').val(),
            phone:$("#phone").val(),
            feedback:$("#feedback").val(),
            url:fan
        }
        $.ajax({
            type: "POST",
            contentType: "application/json;charset=UTF-8",
            url: "${base}/wx/feedback/save",
            data:  JSON.stringify(jsonDate) ,
            success: function (data) {
                if (data.code === 200) {
                    mui.alert("提交成功")
                    setTimeout(function () {
                        window.location.href = "${base}/wx/user/personal.html";
                    }, 300)
                } else {
                    mui.alert(data.msg)
                }
            },
        });

    }
</script>
</html>


